<template>
  <transition name="fade">
    <router-view></router-view>
  </transition>
</template>
<style>
/* 解决element-ui的table表格控件表头与内容列不对齐问题 */
.el-table th.gutter {
  display: table-cell !important;
}
</style>
<script>
export default {
  computed: {
    // ...mapGetters(["themeName"])
    menuLayout: {
      set(val) {
        this.$store.commit("common/updateMenuLayout", val);
      },
      get() {
        return this.$store.state.common.menuLayout;
      }
    },
    breLayout: {
      set(val) {
        this.$store.commit("common/updateBreadcrumbLayout", val);
      },
      get() {
        return this.$store.state.common.breadcrumbLayout;
      }
    },
    breOpen: {
      set(val) {
        this.$store.commit("common/updateBreadcrumbOpen", val);
      },
      get() {
        return this.$store.state.common.breadcrumbOpen;
      }
    },
    tabOpen: {
      set(val) {
        this.$store.commit("common/updateTabOpen", val);
      },
      get() {
        return this.$store.state.common.tabOpen;
      }
    }
  },
  activated() {
    let READYTOPROCESS = false;
    window.onbeforeunload = e => {
      if (!READYTOPROCESS) {
        //message to be returned to the popup box.
        var message = "你确定要关闭吗？",
          a = e || window.event;
        if (a) e.returnValue = message; // IE
        return message; // Safari
      }
    };
  },
  mounted() {
    var item = localStorage.getItem("theme_color");
    var layout = localStorage.getItem("theme_layout");

    var openBre_ = localStorage.getItem("openBreadcrumb");
    var breLayout_ = localStorage.getItem("breadcrumbLayout");

    var openTabs_ = localStorage.getItem("openTabs");

    if (openBre_ == null) {
      openBre_ = true;
    }
    if (breLayout_ == null) {
      breLayout_ = "header";
    }

    if (breLayout_ != null) this.breLayout = breLayout_;
    if (openBre_ != null) this.breOpen = openBre_;

    if (openTabs_ != null) this.tabOpen = openTabs_;

    var classNames = "";
    if (item) {
      classNames += item + " ";
    }
    if (layout) {
      classNames += "tr-" + layout + " ";
      this.menuLayout = layout;
    } else {
      this.menuLayout = "sidebar";
    }

    if (classNames) {
      document.body.className = classNames;
    }
  }
};
</script>
